<link type="text/css" href="https://cdn.bootcdn.net/ajax/libs/amazeui/2.7.2/css/amazeui.min.css" rel="stylesheet">
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/amazeui/2.7.2/js/amazeui.min.js"></script>
<style type="text/css">
	.container-box{
		height: 100vh;
	}
	.amazeui-headerbox{
		position: relative;
		min-height: 10%;
		background-color: #666;
	}
	.leftbox,.rightbox{
		float: left;
		width: 50%;
		height: 90%;
	}
	.leftbox{
		background-color: #888;
	}
	.rightbox{
		background-color: #999;
	}
</style>



<div class="container-box">
	<div class="amazeui-headerbox">
		<!-- 框架的组件文档 "http://amazeui.shopxo.net/widgets/menu/" -->
		<nav data-am-widget="menu" class="am-menu am-menu-default" > 
			<ul class="am-menu-nav am-avg-sm-3">
				<li>
					<a href="##" >公司</a>
				</li>
				<li class="am-parent">
					<a href="##" >人物</a>
					<ul class="am-menu-sub am-collapse  am-avg-sm-3 ">
						<li>
							<a href="##" >公司</a>
						</li>
						<li>
							<a href="##" >人物</a>
						</li>
						<li>
							<a href="##" >趋势</a>
						</li>
						<li>
							<a href="##" >投融资</a>
						</li>
						<li>
							<a href="##" >创业公司</a>
						</li>
						<li>
							<a href="##" >创业人物</a>
						</li>
					</ul>
				</li>
				<li>
					<a href="#c3" >趋势</a>
				</li>
				<li>
					<a href="##" >投融资</a>
				</li>
				<li>
					<a href="##" >创业公司</a>
				</li>
				<li>
					<a href="##" >创业人物</a>
				</li>
			</ul>
		</nav>
	</div>


	<!-- 左侧区域描述 -->
	<div class="leftbox">
		

	</div>


	<!-- 右侧区域描述 -->
	<div class="rightbox">
		
		
	</div>
</div>

<script type="text/javascript">

	//获取导航栏的点击项
	var navitem=$(".am-menu-nav>li");
	navitem.click(function(){
		console.log($(this).index());
		//利用addClass()、removeClass()来控制当前点击项的样式。
		//siblings()可获取当前点击项的其他兄弟元素
		//dosomething
	});

</script>